<?xml version='1.0' encoding='UTF-8' ?>
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:h="http://java.sun.com/jsf/html"
                                xmlns:p="http://primefaces.prime.com.tr/ui"

                template="WEB-INF/template.xhtml">
    <ui:param name="page_title" value="My Feeds"/>
    <div id="addRss">
        <h:form id="formAddRss">
            <h:outputLabel for="addRss" id="lblAddRss">Add RSS</h:outputLabel>
            <h:inputText id="addRss" value="#{FeedsBackingBean.feedUrl}" />
            <p:message for="addRss" />
            <h:commandButton id="btnAddRss" value="Add Feed" action="#{FeedsControllerBean.addFeed()}"/>
        </h:form>
    </div>
    <ui:repeat value="#{FeedsBackingBean.feeds}" var="feed">
        <div class="feed collapse-container">
            <h:form>
                <h3>
                    <button type="button" class="collapse-button">▼</button>
                    <h:outputText value=" #{feed.name} "/>
                    <h:commandButton image="/icons/rss-remove-icon.png" actionListener="#{FeedsControllerBean.removeFeed}">
                        <f:attribute name="data" value="#{feed}"/>
                    </h:commandButton>
                </h3>
            </h:form>
            <ul id="items" class="collapsible">
                <ui:repeat value="#{feed.items}" var="item">
                    <li>
                        <h3>
                            <h:outputText styleClass="title" value="#{item.title}"/>
                            <h:outputText styleClass="date" value=" (#{item.pubDateString})"/>
                        </h3>
                        <p class="summary"><h:outputText value="#{item.description}"/></p>
                        <p class="link"><h:outputLink value="#{item.link}">Link</h:outputLink></p>
                    </li>
                </ui:repeat>
            </ul>
        </div>
    </ui:repeat>
</ui:composition>